<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<script>
  window.onload = function () {
    class person {// 类，指的是整个类域
      // #xValue = 42; // 私有属性
      // static myStaticProp
      // myProp1 = 42; // 实例属性 可以不必写在构造函数上
      constructor() {
        /***
         * constructor方法默认返回实例对象（即this），完全可以指定返回另外一个对象。
         * 也是类的构造函数
         */
        this.sex = 'nan'
        this.names = 'kate'
      }

      /***
       * 1.static关键字，就表示该方法不会被实例继承，2.但是父类seyHello的静态方法，子类Bar可以调用这个方法。3.静态方法也是可以从super对象上调用的。
       * 1.而是直接通过类来调用，2.静态方法也是可以从super对象上调用的。
       * 静态方法可以与非静态方法重名。
       * 这就称为“静态方法”；
       */
      static seyHello() {
        /***
         * 如果静态方法包含this关键字，这个this指的是类，而不是实例。
         **/
        console.log(this, '静态方法');
      }

      sayHello() {
        console.log('', this);
        console.log('', 'hello,my name is ' + this.names + '!');
      }

      doSomeThing() {
        this.sayHello()
        console.log('I am kill people~ hhh! ', this);
      }

      foo(baz) {// 公有方法
        bar.call(this, baz);
      }
    }

    /**
     * 静态属性指的是 Class 本身的属性，即Class.propName，而不是定义在实例对象（this）上的属性
     * 创建静态属性，语法 1.person.prop = 1;
     * */
    person.prop = 1;

    /***
     * foo是公有方法，内部调用了bar.call(this, baz)。
     * 这使得bar实际上成为了当前模块的私有方法。
     */
    function bar() {
      return this.snaf = baz;
    }

/**
 * 这几种写法是有区别的
 * */
    person.seyHello() // 调用类的静态方法
    new person() //类必须使用new调用 ，调用类
    let P = new person() // 实例对象 // 创建实例
    P.doSomeThing() //调用类的方法


    class Women extends person {
      constructor( a,b) {
        /**
         * 在子类的构造函数中，只有调用super之后，才可以使用this关键字，否则会报错
         * super这个关键字，既可以当作函数使用，也可以当作对象使用
         * super指向父类的原型对象
         * */
        super(a,b)
      }
      toString(){
        /**
         *super表示是一个对象，指向父类的原型对象
         * **/
        super.doSomeThing()
      }
    }

    /**
     * extends Class 可以通过extends关键字实现继承
     * */


    Women._propto_='1'
  }
</script>
<script>
  // encodeURIComponent
  import axios from "axios";

  import { message } from "antd";

  import { browserHistory } from 'react-router';

  import querystring from 'querystring';

  import store from "STORE";

  axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

  // TODO: 需要实现一层cache

  const request = {
    handleData: function (res, resolve, reject) {
      let data = res.data;
      if (data.head && data.head.status == "Y") {
        resolve(data.body);
      }else {
        message.destroy();
        let code = data.head.code,
          errorInfo = data.head.msg;
        if (code === "11111114") {
          message.error(errorInfo, 2, () => {
            let redirect = location.pathname;
            browserHistory.push({
              pathname: '/login',
              search: `?redirect=${encodeURIComponent(redirect)}`
            });
            // 清空app
            store.dispatch({
              type: "APP_EMPTY"
            })
            localStorage.clear();
          })
          return;
        }
        message.error(errorInfo, 3);
        reject && reject(data);
      }
    },
    post: function (url, params, type) {
      let _this = this,
        config = {};
      if (type && type == "json") {
        config = {
          headers: {
            post: {
              'Content-Type': 'application/json'
            }
          }
        }
      } else if (type && type == "file") {
        config = {
          headers: {
            post: {
              'Content-Type': 'multipart/form-data'
            }
          }
        }
      } else {
        params = querystring.stringify(params);
      }
      return new Promise((resolve, reject) => {
        axios.post(url, params, config).then((res) => {
          _this.handleData(res, resolve, reject);
        })
      })
    },
    get: function (url) {
      let _this = this;
      return new Promise((resolve, reject) => {
        axios.get(url).then((res) => {
          _this.handleData(res, resolve, reject);
        })
      })
    }
  }

  export default request;
</script>
</body>
</html>
